/*  CE CSS
*   Author:Sandra Elspass
*   Author URI: http://www.webpages.de
*   Version: 0.5
*   Projekt: Backenddummy
*   
*   Die ce.css ist dafür da, Layoutspezifische Dinge an zu passen. 
*   Es sollte darauf geachtet werden, das nicht benötigte Elemente, nach der Umsetzung der Site, gelöscht werden. 
*   Ebenso muss wie bei der basic.css eine MIN datei erstellt werden. www.codebeautifier.com/
*   Aber VORSICHT!! Der Filtert CSS3 Angaben raus. Das kann der nicht.
*   Bei den Icons kann standardmäßig zwischen zwei Farben gewählt werden. Rot und Blau. 
*   Und zwischen zwei Größen 16px x 16px nd 32px x 32px.
*   Tabellen, Formulare, Buttons und Icons können natürlich auch grundlegend verändert werden.
*   Das ganze Grundgerüst ist so aufgebaut, dass wenn man der .page_margin eine andere Breite gibt, der Content sich automatisch an diese Breite anpasst.
*   
*/

@media all {

html * { font-size: 100.01% }
.page_margins{}
.page{}
#header{}
#topnav{color:#fff;}
#mainNav{}
#mainNav ul{ }
#main{}
#footer{}

/************************* Überschriften *************************/
h1,h2,h3,h4,h5,h6 {font-weight: bold; color:#fff; margin: 0 0 10px 0; padding: 0 0 5px 0; }

h1 {}
h2 {}
h3 {}
h4 {}
h5 {}
h6 {}

/************************* Bilder *************************/
img {}

/************************* Textauszeichnungen *************************/
p { }
span.bold{ }
.note { }
.important { }
.warning { }
.floatbox{ }
.float_left { }
.float_right {}
.center { }

/************************* Login Logout *************************/
.log .page_margins{background:none;}
#logForm{ background:#fff; width:400px; margin: 10% auto; padding:20px; }
#logForm .logo{ margin: 0 0 20px 0; }
#logForm input{ width: 200px; }
#logForm .type-button input{ width: 212px; margin: 0 0 10px 0; }
#logForm a{text-decoration:underline; color:#7e1438;}

/************************* Tabellen *************************/
table{ width:100%; }
table thead tr{ background:#002126;}
table tr th{ padding:5px;  color:#fff;}
table tr{ padding:0; margin: 0; border-bottom: 1px solid #fff; color:#fff;}
table tr.even{ background:#02424d; }
table tr.odd{ background: #035462; }
table tr td{ padding:5px; }
table tr td.width p{width: 560px!important; overflow: hidden;}

/************************* Formulare *************************/
form{  }
form .label-Text, form .label-Password, form .label-Textarea, form .label-File, form .label-Select{width:180px; float:left; margin: 0 15px 5px 0; color: #fff;/*font-weight:bold; display:block; margin: 0 0 5px 0;*/}
form .type-text, form .type-textarea, form .type-button, form .type-check, form .type-radio, form .type-file{ margin: 0 0 10px 0; }
/*Textfelder*/
form .type-Text, form .type-Password{ margin: 0 5px 10px 0; }
form .type-Text input, form .type-Password input{ height:20px; line-height:20px;padding: 0 5px; border: 1px solid #cdcdcd;width: 500px;}
form .floatbox .type-Text, form .floatbox .type-Password { float:left; }
/*Textarea*/
form .type-textarea{  }
form .type-Textarea textarea{ height:100px; width:500px;padding: 0 5px; border: 1px solid #cdcdcd;margin: 0 5px 10px 0;}    /*Buttons*/
/*Buttons*/
form .button{  }
form input.button { cursor:pointer;background:#00d2f1;overflow: hidden; border: none; padding:2px 10px 2px 10px; color:#000; font-size: 14px; font-weight:bold;text-transform: uppercase;margin: 10px 0 10px 0;}
/*Checkboxen*/
form .type-check{ clear:both; overflow: hidden; }
form .type-check input{ float:left; }
form .type-check label{ float:left; margin: 0 0 0 5px; }
/*Radioboxen*/
form .type-radio{ }
form .type-radio label{ float:left; margin: 0 5px;}
form .type-radio input{ float:left; }
form .floatbox .type-radio { float:left; }
/*Fileupload*/
form .type-file{ position: relative; }
form .type-file .file{ height:22px;}
/*Datum*/
.type-Select select{ padding:0 0 0 3px; margin: 0 0 10px;}
.date{  }
.date .day{  }
.date .month{  }
.date .jear{  }

#user_password .type-Password input, #authentication_login .type-Password input, #authentication_login .type-Text input{width:200px;}
#authentication_login .label-Password, #authentication_login .label-Text{width:120px;}

/************************* Buttons *************************/
.btn-set{ clear:both;overflow:hidden; padding: 10px 0; }
.btn-set .btn_square, .btn-set .btn_round {margin: 0 10px;float:left; background:#437aa4;background-image: linear-gradient(bottom, #014474 0%, #5387AF 100%);background-image: -o-linear-gradient(bottom, #014474 0%, #5387AF 100%);background-image: -moz-linear-gradient(bottom, #014474 0%, #5387AF 100%);background-image: -webkit-linear-gradient(bottom, #014474 0%, #5387AF 100%);background-image: -ms-linear-gradient(bottom, #014474 0%, #5387AF 100%);background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #014474),color-stop(1, #5387AF)); overflow: hidden; border: none; padding:5px; color:#fff; font-weight:bold;}
.btn-set .btn_round { -webkit-border-radius: 10px;-khtml-border-radius: 10px;-moz-border-radius: 10px; border-radius: 10px; }

/************************* Icons *************************/
/*Icons Blau*/
/*Icons 32x32 */
.iconBack, .iconDelete, .iconDown, .iconEdit, .iconFav, .iconHook, .iconInfo, .iconNext, .iconPlus, .iconQuestion, .iconReload, .iconUnlock, .iconLock, .iconUp, .iconBack, .iconPassword{height:16px; width:16px;display:block;float:left;margin:0 2px;cursor: pointer}
.iconBack{background:url(../../img/backend/icons/16x16/blue/back_blue.png) no-repeat 0 0;}
.iconDelete{background:url(../../img/backend/icons/16x16/red/delete_red.png) no-repeat 0 0;}
.iconDown{background:url(../../img/backend/icons/16x16/blue/down_blue.png) no-repeat 0 0;}
.iconEdit{background:url(../../img/backend/icons/16x16/blue/edit_blue.png) no-repeat 0 0;}
.iconEditFirst{margin: 5px 2px 0 0;}
.iconFav{background:url(../../img/backend/icons/16x16/blue/fav_blue.png) no-repeat 0 0;}
.iconHook{background:url(../../img/backend/icons/16x16/blue/hook_blue.png) no-repeat 0 0;}
.iconInfo{background:url(../../img/backend/icons/16x16/blue/info_blue.png) no-repeat 0 0;}
.iconNext{background:url(../../img/backend/icons/16x16/blue/next_blue.png) no-repeat 0 0;}
.iconPlus{background:url(../../img/backend/icons/16x16/blue/plus_blue.png) no-repeat 0 0;}
.iconQuestion{background:url(../../img/backend/icons/16x16/blue/question_mark_blue.png) no-repeat 0 0;}
.iconReload{background:url(../../img/backend/icons/16x16/blue/reload_blue.png) no-repeat 0 0;}
.iconUnlock{background:url(../../img/backend/icons/16x16/blue/unlock_blue.png) no-repeat 0 0;}
.iconLock{background:url(../../img/backend/icons/16x16/blue/lock_blue.png) no-repeat 0 0;}
.iconUp{background:url(../../img/backend/icons/16x16/blue/up_blue.png) no-repeat 0 0;}
.iconPassword{background:url(../../img/backend/icons/16x16/blue/password_blue.png) no-repeat 0 0;}

.right {float:right}

/*akkordeon im unternehmensbereiche*/
.department {margin-bottom: 80px;color:#fff;}
.department a{color:#fff; text-decoration: none; cursor: pointer;}
.departmentName {  font-weight: bold; background:#002126; margin: 0 0 5px 0; padding: 10px 0 10px 10px;}
.departmentVideos{ font-weight: bold; background:#002126; margin: 0 0 5px 0; padding: 5px 0 5px 28px; display: block; font-size: 14px;}
.departmentPictures{ font-weight: bold; margin: 0 0 10px 0; padding: 0 0 5px 0;}
.departmanetCategoryName{margin: 0; padding:5px 0; display: block;}
.departmentVideos.ui-state-default{background: url("../../img/backend/icon_arrow_no.gif") no-repeat 8px 8px #002126;}
.departmentVideos.ui-state-hover{background: url("../../img/backend/icon_arrow_ho.gif") no-repeat 8px 8px #002126;}
.departmentVideos.ui-state-active{background: url("../../img/backend/icon_arrow_mo.gif")no-repeat 8px 8px #002126;}
.ui-accordion-content{padding: 10px 0;}
.departmanetCategoryName .number{margin: 0 14px 0 10px;}
.departmanetCategoryName .innertext{background: url("../../img/backend/icon_arrow_no.gif") no-repeat 0px 7px; padding: 0 0 0 16px;}
    .departmanetCategoryName .innertext:hover{background: url("../../img/backend/icon_arrow_ho.gif") no-repeat 0px 7px; padding: 0 0 0 16px;}
    .departmanetCategoryName.ui-state-active .innertext{background: url("../../img/backend/icon_arrow_mo.gif") no-repeat 0px 7px; padding: 0 0 0 16px;}
a.newVideoOrdner, a.newVideo{color:#00d2f1; margin: 0 0 0 10px;}
p.videotext {margin: 0 0 0 10px;padding: 5px 0;}
span.anz{padding: 0 140px 0 0;float: right;color: #ccc;}
span.bearb{padding: 0 264px 0 0;float: right;color: #ccc;}
a.adddepartment{background:#002126; margin: 0 0 5px 0; padding: 5px 0 5px 10px; display: block; text-decoration: none;}
.innerContent .ui-accordion-content{padding: 10px 0; background:#02424d;}
.departmanetCategoryName.even {background:#02424d;}
.departmanetCategoryName.odd  {background:#035462;}


.ui-accordion-content span.anz{padding: 0 145px 0 0;}
.ui-accordion-content span.bearb{padding: 0 268px 0 0;}

.changeDepartment{float:right }
.changeVideocategory{float:right}


.search {float: right; padding: 2px 0 0}
.search input{border: none;width: 140px;padding: 0 5px;height: 18px;-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}
.search label {text-transform: uppercase;font-weight: bold;font-size: 14px;color:#fff;}

.mycompany .firstElement{float: left; height: 20px;width: 200px;margin: 0 5px 0 0;}
.mycompany .secondElement{float: left; height: 20px;}

.mycompany .mycompanydiv {overflow: hidden;clear: both;margin: 0 0 5px 0;}

}

